<template>
  <svg width="130" height="10" viewBox="0 0 130 10" fill="none" xmlns="http://www.w3.org/2000/svg">
    <g
      id="_&#195;&#165;&#226;&#128;&#186;&#194;&#190;&#195;&#165;&#194;&#177;&#226;&#128;&#154;_1"
      clip-path="url(#clip0_40_236418)">
      <g id="Clip path group">
        <mask
          id="mask0_40_236418"
          style="mask-type: luminance"
          maskUnits="userSpaceOnUse"
          x="0"
          y="0"
          width="130"
          height="10">
          <g id="clippath">
            <path id="Vector" d="M130 0H0.00488281V10H130V0Z" fill="white" />
          </g>
        </mask>
        <g mask="url(#mask0_40_236418)">
          <g id="Group">
            <path
              id="Vector_2"
              d="M0.0454252 8.94813C-0.102542 9.20559 0.122932 9.47023 0.661956 9.67079C1.20059 9.87147 1.99758 9.98746 2.83763 9.98783H63.7599C65.1335 9.98783 66.3082 9.68127 66.5525 9.26091L71.2064 1.22272C71.3544 0.965262 71.1285 0.700616 70.5899 0.500061C70.0509 0.299383 69.2543 0.183387 68.4142 0.183022H7.49156C6.11796 0.183022 4.94323 0.489582 4.69896 0.909945L0.0454252 8.94813ZM74.6801 8.77158C74.5322 9.02904 74.758 9.29356 75.2967 9.49424C75.8357 9.69479 76.6323 9.81091 77.4723 9.81115H83.9085C85.2821 9.81115 86.4569 9.50459 86.7011 9.08423L91.3555 1.04604C91.5034 0.788588 91.2776 0.523942 90.7389 0.323386C90.1999 0.122709 89.4033 0.00671319 88.5632 0.00634766H82.1271C80.7535 0.00634766 79.5787 0.312908 79.3345 0.73327L74.6801 8.77158Z"
              :fill="color" />
            <path
              id="Vector_3"
              d="M94.2612 8.77158C94.1132 9.02904 94.3391 9.29356 94.8777 9.49424C95.4168 9.69479 96.2134 9.81091 97.0534 9.81115H103.49C104.863 9.81115 106.038 9.50459 106.282 9.08423L110.937 1.04604C111.084 0.788588 110.859 0.523942 110.32 0.323386C109.781 0.122709 108.984 0.00671319 108.144 0.00634766H101.708C100.335 0.00634766 99.1598 0.312908 98.9155 0.73327L94.2612 8.77146V8.77158Z"
              :fill="color"
              fill-opacity="0.6" />
            <path
              id="Vector_4"
              d="M113.275 8.77158C113.127 9.02904 113.353 9.29356 113.891 9.49424C114.43 9.69479 115.227 9.81091 116.067 9.81115H122.503C123.877 9.81115 125.052 9.50459 125.296 9.08423L129.95 1.04604C130.098 0.788588 129.872 0.523942 129.333 0.323386C128.794 0.122709 127.998 0.00671319 127.158 0.00634766H120.721C119.348 0.00634766 118.173 0.312908 117.929 0.73327L113.274 8.77146L113.275 8.77158Z"
              :fill="color"
              fill-opacity="0.2" />
          </g>
        </g>
      </g>
    </g>
    <defs>
      <clipPath id="clip0_40_236418">
        <rect width="130" height="10" fill="white" />
      </clipPath>
    </defs>
  </svg>
</template>

<script setup>

import { useConfigStore } from '@/store/modules/config'
const configStore = useConfigStore()
const color = configStore.topics.bgColor
</script>

<style scoped></style>
